<template>
  <div class="vita-item" v-bind:class="type" @click="onItemTap">

    <!-- 普通样式 -->
    <template v-if="type=='vita-item-default'">
        <h2 class="vita-item-label">{{item.label}}</h2>
        <p class="vita-item-text">{{item.text}}</p>
    </template>
  
    <!-- 缩略图样式 -->
    <template v-if="type=='vita-item-thumbnail'">
      <Image :src="item.thumbnail"></Image>
        <h2 class="vita-item-label">{{item.label}}</h2>
        <p class="vita-item-text">{{item.text}}</p>
    </template>

  </div>
</template>

<script>

  import Image from './image.vue'

  export default {

    name: 'vita-item',

    props: ['item', 'type'],

    components: {Image},

    methods: {
      onItemTap() {
        this.$dispatch('vita-item-tap', this.item)
      }
    },

    data() {
      return {
        
      }
    },

  }
</script>

<style lang='sass'>
  
</style>